<template>
  <div class="contrainer">
    <el-button type="info" @click="addFriend">add friends</el-button>
     <el-dialog title="add friend" 
     v-model="dialogVisible"
     width="50%">
     <el-input v-model="input" placeholder="please input your friend's id"></el-input>
      <template #footer>
        <span class="dialog-footer">

       
        <el-button type="info" @click="dialogVisible=false">return</el-button>
        <el-button type="primary" @click="confirm_yes">Yes</el-button>
         </span>
      </template>
     </el-dialog>
  </div>
</template>

<script>
import {ref,getCurrentInstance} from 'vue'
import {ElButton, ElDialog, ElInput} from 'element-plus'
export default {
    components:{
      ElButton,ElDialog,ElInput
    },
    setup(){
     
      const {proxy} = getCurrentInstance()
      let input = ref('')
      let dialogVisible = ref(false)
      
      // localStorage.setItem("userid", )
      const addFriend = ()=>{
        dialogVisible.value = true
      }
     const confirm_yes = ()=>{
       //获取到了当前的用户信息
      let userinfo = JSON.parse(localStorage.getItem('userinfo'))
       dialogVisible.value = false
      //  console.log(input.value)
       proxy.$axios.post('/v1/contact/addfriend',{
         userid:parseInt(userinfo.id),
         dstid:parseInt(input.value)
       }).then((response)=>{
         console.log(response)
       }).catch((error)=>{
        //  console.log(error)
       })
     }
      return{
        dialogVisible,
        addFriend,
        input,
        confirm_yes
      
      }
      
    }
}
</script>

<style>
  
</style>